/** @dtcloud-module **/
import {useOwnedDialogs, useService} from "@web/core/utils/hooks";
import {Component, onWillUpdateProps, useState, xml} from "@dtcloud/owl";

export class FunButton extends Component {
    setup() {
        this.user = useService("user");
        this.action = useService("action");
        this.state = useState(JSON.parse(this.env.model.config.activeFields[this.props.fieldName].context.replace("'", '')))
    }

    get isInEdition() {
        if (this.env.model.config.mode === "readonly") {
            return false;
        } else {
            return this.env.model.config.mode === "edit";
        }
    }

    //是否显示按钮
    get isFun() {
        // let  s = this.props.record.model.config.activeFields;
        // this.props.record.update({ [this.props.fieldName]: "1234567890",note: "wertyhjk" });
        // this.props.mode || "edit";
        return true
    }

    //显示图标
    get isIco() {
        // let  s = this.props.record.model.config.activeFields;
        // this.props.record.update({ [this.props.fieldName]: "1234567890",note: "wertyhjk" });
        // this.props.mode || "edit";
        return "fa fa-search"
    }


    //自定义按钮事件
    onClick(ev) {
        const {fieldName, record} = this.props;
        let jsonString = this.env.model.config.activeFields[fieldName].context.replace("'", '')
        let obj = JSON.parse(jsonString);

        switch (obj.fun_type) {
            case "url":
                this._url(this, jsonString);
                break;
            case "ir.actions.client":
                this._ir_actions_client();
                break;
            case "ir.actions.act_window":
                this._ir_actions_act_window()
                console.log("I own a dog");
                break;
            case "ir.actions.report":
                this._ir_actions_report();
                break;
            case "ir.actions.server":
                this._ir_actions_server();
                break;
            case "ir.actions.act_url":
                this._ir_actions_act_url();
                break;
            case "from_qweb":
                this._from_qweb();
                break;
            default:

                break;
        }

        // this.action.doAction({
        //            type: "ir.actions.act_window",
        //            res_model: "res.partner",
        //            res_id: 1,
        //            views: [[false, "form"]],
        //            target: "new",
        //        });
        //                const url = "/amos/index";
        //                const url = "/amos/index";
        //
        //
        //               var  ww =this.action.doAction({
        //                name: "11",
        //                type: "ir.actions.client",
        //                tag: 'tag.baidu_map_url',
        //                target: "new",
        //                // params: { url },
        //            });
        //
        //


        // let  s = this.props.record.model.config.activeFields;
        //界面上下文获取
//         const { fieldName, record } = this.props;
//
//                          const div = document.createElement('div');
//                     div.innerHTML =`<div id="myModal" class="modal fade show" tabindex="0" aria-labelledby="myModalLabel" style="display: block;justify-content: center;" aria-modal="true" role="dialog">
// <div class="modal-content" style="width: 80%;position: absolute;
//             top: 10%;
//             left: 50%;
//             transform: translate(-50%, 0);">
//                                         <div class="modal-header">
//                                             <h5 class="modal-title"
//                                                 id="myModalLabel">弹出窗口</h5>
//                                             <button type="button"
//                                                 class="btn-close"
//                                                 data-dismiss="alert"
//                                                 aria-label="Close"></button>
//                                         </div>
//                                         <div class="modal-body">
//                                 <iframe id="html_200" width="100%" height="100%" frameborder="0" scrolling="no" src="/amos/index"/></div></div> </div>`;
//                      document.body.appendChild(div);
//


    }

    objectToUrlParams(obj) {
        let params = '';
        for (let key in obj) {
            if (obj.hasOwnProperty(key)) {
                params += key + '=' + encodeURIComponent(obj[key]) + '&';
            }
        }
        return params.slice(0, -1);
    }

    _url(o, jsonString) {
        let tit = this.state.fun_windows_title;
        let fun_name = this.state.fun_name; //调用类型
        let url = this.state.form_url;

        const urlParams = this.objectToUrlParams(this.state);
        const {fieldName, record} = this.props;
        var value = record._values[fieldName]

        let aa = url + "?" + urlParams;

        debugger


        let area = ['800px', '550px'];
        if (this.state.fun_area != undefined) {
            area = this.state.fun_area.split(',')
        }

        debugger

        let index = layer.open({
            //标题
            title: tit,
            // 基本层类型：0（信息框，默认）1（页面层）2（iframe层，也就是解析content）3（加载层）4（tips层）
            type: 2,
            // 宽高：如果是100%就是满屏
            area: area,
            // 如果不想要界面滚动条可以这样写
            //content: ["内容/url",'no']
            content: url + "?" + urlParams,
            // 坐标：auto（默认坐标，即垂直水平居中），具体当文档：https://www.layui.com/doc/modules/layer.html#offset
            // offset: 'auto',
            // 遮罩透明度：默认：0.3透明度的黑色背景（'#000'）
            shade: 0.6,
            // 是否点击遮罩关闭：默认：false
            shadeClose: false,
            // 自动关闭所需毫秒：默认：0不会自动关闭
            time: 0,
            // 最大最小化：默认：false
            maxmin: true,
            anim: 0, // 0-6 的动画形式，-1 不开启
            // 固定：默认：true
            fixed: true,
            btnAlign: 'c',
            async: false,
            loading: true,
            params: this.state,
            // 是否允许拉伸：默认：true
            resize: true,
            // 层叠顺序：默认：19891014，一般用于解决和其它组件的层叠冲突
            zIndex: 19891014,

            // 关闭按钮：layer提供了两种风格的关闭按钮，可通过配置1和2来展示，如果不显示，则0
            closeBtn: 1,

            // 按钮：按钮1的回调是yes（也可以是btn1），而从按钮2开始，则回调为btn2: function(){}，以此类推
            btn: ['确定', '关闭'],
            // 第一个按钮事件，也可以叫btn1
            yes: function (index) {
                debugger
                //跳转不同的窗口
                switch (fun_name) {
                    case "url":
                        break;
                    case "map_point":
                        //百度点标注
                        o._url_map_point(o, index);
                        break;
                    case "from_qweb":
                        break;
                    default:
                        o._url_default(o, index);
                        break;
                }
                // 获取 iframe 的窗口对象
                // var iframeWin =  window[layero.find('iframe')[0]['name']];
                // var elemMark = iframeWin.$('#mark'); // 获得 iframe 中某个输入框元素
                // var value = elemMark.val();
                // if($.trim(value) === '') return elemMark.focus();
                // // 显示获得的值
                // layer.msg('获得 iframe 中的输入框标记值：'+ value);

                //最后关闭弹出层
                layer.close(index);
            }
            ,
            bt2: function (index, layer) {
                //点击第二个按钮执行
                // alert("点击第二个按钮执行")
            }
            ,

            // 右上角关闭按钮触发的回调：默认会自动触发关闭。如果不想关闭，return false即可
            cancel: function (index) {
                // if (layer.confirm('确定要关闭么')) { //只有当点击confirm框的确定时，该层才会关闭
                //     layer.close(index);
                // }
                layer.close(index);
                return false;
            }
            ,
            // 层销毁后触发的回调：无论是确认还是取消，只要层被销毁了，end都会执行，不携带任何参数。
            end: (index, layero) => {
                layer.close(index);
                // 层销毁后触发的回调：无论是确认还是取消，只要层被销毁了，end都会执行，不携带任何参数
                // alert("层销毁后触发的回调：无论是确认还是取消，只要层被销毁了，end都会执行，不携带任何参数")
            },
            // 层弹出后的成功回调方法：layero前层DOM，index当前层索引
            success:

                function (layero, index) {
                    // alert("巧妙的地方在这里哦")
                    var body = layer.getChildFrame('body', index);  //巧妙的地方在这里哦
                    //绑定查询条件
                    body.find('input[name = "search_name"]').val(value)
                    //传入界面上的参数到子页面
                    body.contents().find("#param").val(jsonString);
                    // form.render(); //更新全部
                }

            // 最大化后触发的回调：携带一个参数，即当前层DOM
            ,
            full: function (layer) {
                // 最大化后触发的回调：携带一个参数，即当前层DOM
                // alert("最大化后触发的回调：携带一个参数，即当前层DOM");
            }
            ,
            // 最小化后触发的回调：携带一个参数，即当前层DOM
            min: function (layer) {
                // 最小化后触发的回调：携带一个参数，即当前层DOM
                //  alert("最小化后触发的回调：携带一个参数，即当前层DOM");
            }
            ,  // 还原后触发的回调：携带一个参数，即当前层DOM

            restore: function (layer) {
                // 还原后触发的回调：携带一个参数，即当前层DOM
                // alert("还原后触发的回调：携带一个参数，即当前层DOM");
            }
        });
    }

    //百度点标注
    _url_map_point(o, index) {
        debugger
        //当点击‘确定'按钮的时候，获取弹出层返回的值
        var res = window["layui-layer-iframe" + index].callbackdata();
        o.props.record.update({[o.props.fieldName]: res.point});

        return true;
    }

    //通用弹出窗口
    _url_default(o, index) {
        //当点击‘确定'按钮的时候，获取弹出层返回的值
        var iframeWindow = window['layui-layer-iframe' + index];
        //数据值
        var checkStatus = iframeWindow.layui.table.checkStatus('control_table');
        var data = checkStatus.data;
        if (data.length == 1) {
            let arr = o.state.fun_write_field.split(",");
            var dict = {}; // 可以绑定多个字段
            for (let i = 0; i < arr.length; i++) {
                let a = arr[i].split(":");
                if (a[1] != "") {
                    if (a[2] == "Many2one") {
                        dict[a[0]] = data[0][a[1]].split(",");
                    } else if (a[2] == "Many2many") {
                        // dict[a[0]] = [6, false, data[0][a[1]].split(",")] ;
                        // dict[a[0]] =[[6, 0,[1,2]]];
                        // dict[a[0]] =[[6, 0, [1,2]]];
                    } else {
                        dict[a[0]] = data[0][a[1]];
                    }
                }
            }
            if (arr.length == 0) {
                o.props.record.update({[o.props.fieldName]: data[0].name});
            } else {
                o.props.record.update(dict);
            }

            // layer.msg(data[0].caseNature);
            // $("#caseNature").html(data[0].caseNature);
        } else {
            layer.msg("请选择一个值！");
        }
    }


    get _ir_actions_client() {
    }

    get _ir_actions_act_window() {
        this.action.doAction({
            type: "ir.actions.act_window",
            res_model: "res.partner",
            res_id: 1,
            views: [[false, "form"]],
            target: "new",
        });
    }


    get _ir_actions_report() {
        // this.actionService.doAction({
        //     type: "ir.actions.report",
        //     report_type: "qweb-pdf",
        //     report_name: `event.event_registration_report_template_badge/${this.registration.id}`,
        // });
    }

    get _ir_actions_server() {
    }

    _ir_actions_act_url() {
        let url = "/amos/index";
        // this.action.doAction({type: "ir.actions.act_url", url});
        this.action.doAction({
            name: "JS Tests",
            target: "new",
            type: "ir.actions.act_url",
            url: url,
        });

    }


}

FunButton
    .template = "web.FunButton";
FunButton
    .props = {
    fieldName: {type: String},
    record: {type: Object},
};

